<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"/>
  <title>My dear Geer</title>
  <link rel="stylesheet" href="../statics/css/swiper.min.css">
  <style>
    html, body {
      position: relative;
      height: 100%;
      width: 100%;
    }

    img {
      height: 100%;
      width: 100%;
      display: block;
    }

    body {
      background: #eee;
      font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
      font-size: 14px;
      color: #000;
      margin: 0;
      padding: 0;
    }

    .swiper-container {
      width: 100%;
      height: 100%;
    }

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }
  </style>
</head>
<body>
<!-- Swiper -->
<div class="swiper-container">
  <div class="swiper-wrapper">
    <div class="swiper-slide"><img src="../statics/img/1.jpg"/></div>
    <div class="swiper-slide"><img src="../statics/img/1.jpg"/></div>
    <div class="swiper-slide">Slide 3</div>
    <div class="swiper-slide">Slide 4</div>
    <div class="swiper-slide">Slide 5</div>
    <div class="swiper-slide">Slide 6</div>
    <div class="swiper-slide">Slide 7</div>
    <div class="swiper-slide">Slide 8</div>
    <div class="swiper-slide">Slide 9</div>
    <div class="swiper-slide">Slide 10</div>
  </div>
</div>

<!-- Swiper JS -->
<script src="../statics/js/swiper.min.js"></script>

<!-- Initialize Swiper -->
<script>
  var swiper = new Swiper('.swiper-container');
</script>
<script type="application/javascript">
  $(function () {
    /*初始化调用*/
    $.ajax({
      //提交数据的类型 POST GET
      type: "POST",
      //提交的网址
      url: "${request.contextPath}/dependentOffice/checkName",
      //提交的数据
      data: JSON.stringify(GetJsonData()),
      //参数格式为json
      contentType: "application/json; charset=utf-8",
      //返回数据的格式
      datatype: "json",//"xml", "html", "script", "json", "jsonp", "text".
      //成功返回之后调用的函数
      success: function (data) {
        alert(data);
      },
      //调用出错执行的函数
      error: function () {
        //请求出错处理
        alert("请求失败");
      }
    });

    //json格式的数据源
    function GetJsonData() {
      var json = {
        "userName": 'Tom',
        "tel": '10086'
      };
      return json;
    }
  });
</script>
</body>
</html>
